<template>
	<div class="safearea" :style="{ background }"></div>
</template>

<script>
	export default {
		name:"safe-area",
		props: {
		  background: {
		    default: "transparent",
		  },
		},
		data() {
			return {
				
			};
		}
	}
</script>

<style lang="scss" scoped>
.safearea {
  width: 100vw;
  height: env(safe-area-inset-bottom);
	flex-shrink: 0;
}
</style>